<%@page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@include file="/jsp/comm_css_include.jsp"%>
<!-- zTreeStyle.css -->
<link rel="stylesheet" type="text/css"
	href="${basePath}/css/zTreeStyle/zTreeStyle/zTreeStyle.css">
<!doctype html>
<html>
<head>
<style type="text/css">
.gray-bg {
	background-color: #fff;
}
</style>
</head>
<body class="gray-bg">
	<div class="ibox-content">
		<form class="form-horizontal m-t" id="commentForm">
			<table cellpadding="0" cellspacing="0" border="0"
				bordercolor="#3B95C8" width="100%" class="tablefont">
				<tr>
					<td width="23%" align="right"><label
						class="col-sm-3 control-label np">快捷方式名称：</label></td>
					<td width="77%">
						<div class="form-group">
							<div class="col-sm-8">
								<input id="id" name="id" style="display: none" /> <input
									id="powerId" name="powerId" type="hidden" /> <input
									id="shortcutName" name="shortcutName" minlength="1"
									maxlength="64" type="text"
									class="form-control smalliconcur smallicon" required=""
									onclick="choicekj()" placeholder="快捷方式名称(必填)"
									readonly="readonly" />
							</div>
						</div>
					</td>
				</tr>


				<tr>
					<td width="23%" align="right"><label
						class="col-sm-3 control-label np">菜单排序：</label></td>
					<td width="77%">
						<div class="form-group">
							<div class="col-sm-8">
								<input id="sortValue" name="sortValue" minlength="1"
									maxlength="10" type="text"
									class="form-control"
									aria-required="true" placeholder="菜单序号(必填)"/ >
							</div>
						</div>
					</td>
				</tr>


				<tr>
					<td width="23%" align="right"><label
						class="col-sm-3 control-label np">图标路径：</label></td>
					<td width="77%">
						<div class="form-group">
							<div class="col-sm-8">
								<input id="imgUrl" name="imgUrl" minlength="1" maxlength="128"
									type="text" class="form-control smalliconcur smallicon"
									aria-required="true" readonly="readonly" onclick="choiceimg()" />
							</div>
						</div>
					</td>
				</tr>

				<tr>
					<td width="23%" align="right"><label
						class="col-sm-3 control-label np">备注：</label></td>
					<td width="77%">
						<div class="form-group">
							<div class="col-sm-8">
								<textarea id="remarks" name="remarks" cols="20" rows="5"
									type="text" class="form-control" aria-required="true"
									placeholder="请输入备注"></textarea>
							</div>
						</div>
					</td>
				</tr>

			</table>
			<table cellpadding="0" cellspacing="0" border="0"
				bordercolor="#3B95C8" width="100%">
				<tr>
					<td width="100%" align="center">
						<div class="ibox-content">
							<button type="button" class="btn dpbtn_green" onclick="save();">确定</button>
							<button type="button" class="btn dpbtn_red" onclick="Reset();">重置</button>
						</div>
					</td>
				</tr>
			</table>
		</form>
	</div>
	
	<div class="boxList" style="display: none" id="boxList">
		<div class="marcontent" id="rowshorCut">
			<div class="baka"></div>
			<div class="bakb"></div>
			<div class="bakc"></div>
			<div class="bakd"></div>
		</div>	
		
		<table cellpadding="0" cellspacing="0" border="0" bordercolor="#3B95C8" width="100%">
			<tr>
				<td width="100%" align="center">
					<div class="ibox-content" style="border: none">
						<button type="button" class="btn dpbtn_green" onclick="choicesave();">确定</button>
					</div>
				</td>
			</tr>
		</table>
	</div>


	<!-- public quote -->
	<%@include file="/jsp/comm_js_include.jsp"%>

	<!-- custom js -->
	<%@include
		file="/js/common-dpqc/dpqc-validate/comm_validate_include.jsp"%>

	<!--zTreeStyle.js-->
	<script type="text/javascript"
		src="${basePath}/js/zTreeStyle/jquery.ztree.core.js" charset="utf-8"></script>
	<script type="text/javascript"
		src="${basePath}/js/zTreeStyle/jquery.ztree.excheck.js"
		charset="utf-8"></script>

	<!--
    作者：zhangpp
    时间：2017-04-06
    描述：js
-->
	<script type="text/javascript">
	var layerboxList;
	var choiceimg = function() {
		layerboxList = layer.open({
	    	  title:'快捷方式图标选择',
	    	  type: 1,
	    	  area: ['460px', '200px'], //宽高
	    	  content: $("#boxList")
	    });
	}
	
	var imgsrc;
	
	$(function(){
		var $rowdiv = $("#rowshorCut").find("div");
		 $rowdiv.click(function(){
			 $(this).addClass("rowimg");
			 imgsrc = $(this).attr("class");
			 $(this).siblings().removeClass("rowimg");
		 });
	 })
	
	 var choicesave = function() {
		$("#imgUrl").val(imgsrc);
		layer.close(layerboxList);
	}
	
	var choicekj = function() {
		var powerId = $.getUrlData('powerId'); 
	$.dpAjax({
		url:'${basePath}/power/getPowerListForShortcut',
			data:{id:powerId},
			success: function(datas){
				  if(datas.flag == "100100")
			  {	  
					 var content = '<div class="ibox-content" style="height: 230px;border: 1px solid #F5F5F6; overflow:auto;overflow-x: hidden;">'
						+ '	<div id="treeDemo" class="ztree">&nbsp;</div>'
					+ '</div>'
					+ '<div class="ibox-content">'
					+ '	 <button class="btn dpbtn_green" type="button" onclick="confirmBase();">确定</button>'
					+ '	 <button class="btn dpbtn_red" type="button" onclick="cancelBase();">取消</button>'
					+ '</div>';
			
			    	index = layer.open({
				    	  title:'菜单',
				    	  type: 1,
				    	  area: ['300px', '350px'], //宽高
				    	  content: content
				    });
			    	var setting = {
		 					check: {
		 						enable: false
		 					},
		 					data: {
		 						simpleData: {
		 							enable: true
		 						}
		 					}
		 			};			
					  var  arr = [];
					  var result = datas.result;
					  for(var i=0;i<result.length;i++)
					  {  
						  var objs = {};
						  objs.id = result[i].replaceId;
						  objs.pId = result[i].parentId;
						  objs.name = result[i].name;
						  if(result[i].powerCode == 'diepu:base') {
	 					  	 objs.open = true;
	 					  } else {
	 						 objs.open = false;
	 					  }
						  arr.push(objs);
					  } 
				  $.fn.zTree.init($("#treeDemo"), setting, arr);
				  return;
			  }
			  if(datas.flag == "100200")
	          {
				  $.fn.showDatas({"datas":datas});
	        	  return;
	          }
			  layer.msg(datas.message, {icon: 2});
	     }
	});
	}
	
	var confirmBase = function()
	{
		 var zTree = $.fn.zTree.getZTreeObj("treeDemo"); 
		 var node=zTree.getSelectedNodes();
		 var treeNode = node[0];
		 if(treeNode.isParent){
			 layer.msg("请选择子菜单！", {icon: 5});
			 return;
		 }
		 var parentNode = treeNode.getParentNode();
		 if(!parentNode) {
			 layer.msg("只能选择子菜单!", {icon: 5});
			 return;
		 }
		 document.getElementById('shortcutName').value=treeNode.name;
		 document.getElementById('powerId').value=treeNode.id;
		 layer.closeAll(); 
	}
	
	var cancelBase = function()
	{
		layer.closeAll(); 
	}
	
    $(function(){
    	var id = $.getUrlData('id'); 
		$.dpAjax({
	    	url:'${basePath}/BaseShortcutController/getById',
 			data:{
 				"id":id,
 			},
 			success: function(datas){
 				  if(datas.flag == "100100") {
	 					  var result = datas.result;
	 					  $('#id').val(result.replaceId);
		     			  $('#powerId').val(result.powerId);
		     			  $('#shortcutName').val(result.shortcutName);
		     			  $('#sortValue').val(result.sortValue);
		     			  $('#imgUrl').val(result.imgUrl);
		     			  $('#remarks').val(result.remarks);
						  return;
					  }
					  if(datas.flag == "100200") {
						  $.fn.showDatas({"datas":datas});
	                	  return;
	                  }
					  layer.msg(datas.message, {icon: 2});
             }
	     });
	});
    
    var save = function () {
        var validstatus = $("#commentForm").valid();
        if (validstatus) {
            var data = $('#commentForm').serialize();
    		layer.confirm('您确认要修改吗？', {
	  			  btn: ['确定','取消'] //按钮
			},function(){
				layer.closeAll();
            	$.dpAjax({
                url: '${basePath}/BaseShortcutController/modify',
                data: data,
                success: function (datas) {
                    if (datas.flag == "100100") {
                        layer.msg("添加执行成功！", {icon: 6});
                        parent.layer.close(parent.updateLayer);
                        return;
                    }
                    if (datas.flag == "100200") {
                        $.fn.showDatas({"datas": datas});
                        return;
                    }
                    layer.msg(datas.message, {icon: 2});
                }
             });
		  });
        }
    }
    
  //重置
	var Reset  = function(){
		document.getElementById('powerId').value = "";
		document.getElementById('shortcutName').value = "";
		document.getElementById('sortValue').value= "";
		document.getElementById("imgUrl").value= "";
		document.getElementById("remarks").value= "";
	}
</script>
</body>
</html>
